"use client"
import { Button, Col, Row, Watermark, Modal } from "antd";
import { useState } from "react";
import GradientGridBackground from "./GradientGridBackground";
import HandleLogin from "./handleLogin";
import BigCalendar from "./BigCalendar";
import NoteView from "@app/(view)/(other)/note/page";



export default function Login() {
    const [isModalVisible, setIsModalVisible] = useState(false);

    const showModal = () => {
        setIsModalVisible(true);
    };

    const handleCancel = () => {
        setIsModalVisible(false);
    };

    return (<>
        <Row>
            <Col xs={24} sm={24} md={24} lg={32} xl={24}>
                <Watermark content="Zero" >
                    <div className="relative w-full h-screen bg-[#f0f2f5]">

                        {/* <div><GradientGridBackground /></div> */}
                        <div className="w-full flex justify-around h-15 items-center rounded-lg bg-zinc-800/80 text-zinc-100 shadow-lg shadow-zinc-900/50 border border-zinc-700/50 backdrop-blur-sm">
                            <div></div>
                            <div>
                                <Button type="primary" onClick={showModal}>登录</Button>
                            </div>
                        </div>
                        <div><NoteView></NoteView></div>
                        <div><BigCalendar event={[]}></BigCalendar></div>

                        {/* 登录弹窗 */}
                        <Modal
                            title="用户登录"
                            open={isModalVisible}
                            onCancel={handleCancel}
                            footer={null}
                            width={400}
                        >
                            <HandleLogin />
                        </Modal>
                    </div>
                </Watermark>
            </Col>
        </Row>
    </>);
}